<template>
	<view class="wrap">
		<!-- <van-nav-bar title="申请退款" left-arrow @click-left="onClickLeft" /> -->

		<view class="order_refund">
			<view :title="'订单编号: ' + orderItemTemp.orderSn">
				<u-row gutter="16">
					<u-col :span="3">
						<u-image width="100%" height="150rpx" :src="imgUrl+orderItemTemp2.goods.pic"></u-image>
					</u-col>
					<u-col :span="9">
						<view class="gl-name">{{orderItemTemp2.goods.name}}</view>
						<view class="gl-descript">{{orderItemTemp2.goods.descript}}</view>
						<view class="gl-price">
							<u-row>
								<u-col offset="6" :span="3" text-align="right">
									￥{{formatPrice(orderItemTemp2.price)}}
								</u-col>
								<u-col :span="3" text-align="right">
									x{{orderItemTemp2.count}}
								</u-col>
							</u-row>
						</view>
					</u-col>
				</u-row>
			</view>

			<u-form  :model="refundData" :rules="rules" ref="uForm" :errorType="errorType">
				<u-cell-group>
					<u-form-item label-width="150" prop="afterSalesMode" is-link label="售后方式">

						<u-input type="select" :select-open="afterSalesModeInfo.show"
							v-model="afterSalesModeInfo.selectInfo.text" placeholder="请选择售后方式" required=true
							@click="afterSalesModeInfo.show = true"></u-input>
						<u-action-sheet :list="afterSalesModeInfo.actions" v-model="afterSalesModeInfo.show"
							@click="onAfterSalesModeSelect"></u-action-sheet>
					</u-form-item>
					<u-form-item label-width="150" prop="refundReason" is-link label="退款原因">

						<u-input type="select" :select-open="refundReason.show" v-model="refundReason.selectInfo.text"
							placeholder="请选择退款原因" required=true @click="refundReason.show = true"></u-input>

						<u-action-sheet :list="refundReason.actions" v-model="refundReason.show"
							@click="onRefundReasonSelect"></u-action-sheet>
					</u-form-item>
				</u-cell-group>
				<u-cell-group>


					<u-form-item label-width="150" prop="refundAmt" type="number" label="退款金额"
						:rules="[{ required: true, message: '请输入退款金额' }]">


						<u-input :border="border" required=true placeholder="请输入退款金额" type="number"
							v-model="refundData.refundAmt"
							maxlength="formatPrice(orderItemTemp2.price*orderItemTemp2.count)"></u-input>


					</u-form-item>
					<view>最多可退 <span
							style="color: red;">¥{{formatPrice(orderItemTemp2.price*orderItemTemp2.count)}}（含运费0.00）</span>
						,
						退款将返还实际支付金额。</view>
				</u-cell-group>
				<u-cell-group>
					<u-form-item label-width="150" prop="mobile" label="手机号码">

						<u-input :border="border" required=true placeholder="请输入手机号码" type="number" maxlength=11
							v-model="refundData.mobile"></u-input>

					</u-form-item>
					<u-form-item label-width="150" prop="refundMsg"  label="退款说明">
						<u-input type="textarea" :border="border" maxlength=100 placeholder="最多输入100个字"
							v-model="refundData.refundMsg" />
					</u-form-item>
					<u-form-item label="上传凭证" name="uploader" label-width="150">
						<u-upload :file-list="fileList" :header="header" :action="uploadAction"  @on-success="uploadSuccess" @on-error="uploadError" @on-remove="uploadRemove" max-count="4" width="160" height="160"></u-upload>
					</u-form-item>
					<!-- <u-form-item label-width="150" name="uploader" label="上传凭证">
						<template #input>
							<van-uploader v-model="fileList" :after-read="afterRead" multiple :max-count="5" />
						</template> 
					</u-form-item> -->
				</u-cell-group>

				<u-cell-group>
					<u-button round block type="info" native-type="submit" @click="refundApplyValidate">确认提交</u-button>
				</u-cell-group>
			</u-form>
		</view>

	</view>
</template>

<script src="./refund.js"></script>

<style lang="less">
	.order_refund {
		margin: 30rpx;

		.van-panel {
			margin-top: 5px;
		}

		.u-cell-group {
			margin-top: 0.5rem;
		}

		.van-card {
			background-color: #fff;
		}

		.total {
			text-align: right;
			padding: 10px;
		}

		.footer_btn {
			text-align: right;

			.van-button {
				margin-left: 10px;
			}
		}

		.address_detail {
			padding: 5px;
		}

		.van-cell_value-class_red {
			color: red;
		}

		.van-cell_value-class_red,
		.van-cell_value-class {
			display: inline-block;
			text-align: left;
			min-width: 80%; //可根据自己需求设定值
			word-break: break-all; //换行能显示全部字符
		}


	}
</style>
